<div data-role="view" data-title="Maybanhang.Net" id="invoice_list_day" data-layout="mobile-tabstrip-invoice" 
	data-init="initInvoiceDayList" data-show="onInvoiceDayShow">   
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>            
            <ul  id="list-invoice-day">                
                
            </ul>
        </li>        
    </ul>
    <script>
    	
    </script>
</div>
<div data-role="view" data-title="Maybanhang.Net" id="invoice_list_week" data-layout="mobile-tabstrip-invoice" 
	data-init="initInvoiceWeekList"  data-show="onInvoiceWeekShow">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>            
            <ul id="list-invoice-week">                
                
            </ul>
        </li>        
    </ul>    
    
</div>
<div data-role="view" data-title="Maybanhang.Net" id="invoice_list_month" data-layout="mobile-tabstrip-invoice" 
	data-init="initInvoiceMonthList"  data-show="onInvoiceMonthShow">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>            
            <ul id="list-invoice-month">                
                
            </ul>
        </li>        
    </ul>        
</div>
<div data-role="view" data-title="Maybanhang.Net" id="invoice_list_search" data-layout="mobile-tabstrip-invoice" 
	data-show="onInvoiceSearchShow" >
    <div style="margin-bottom: 400px;">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>            
            <ul id="list-invoice-search">                
                
            </ul>
        </li>        
    </ul>   
    </div>         
</div>
<div data-role="layout" data-id="mobile-tabstrip-invoice" >
	<header data-role="header">
        <div data-role="navbar">
            <a id="back-button" class="nav-button" data-align="left" data-role="backbutton" href='#index'>Back</a>
            <span ><?php echo UserInformation::getLocationName(); ?></span>
            <a data-align="right" data-role="button" class="nav-button" href='#index'>Home</a>            
        </div>
    </header>   
    
    <div data-role="footer">	
    	<div class="search-container" style="display: none;"  >         	
		     	<div style="height: 2px;"></div>
		        <input type="text" class="search-text" placeholder="Tìm kiếm " id="text_search_invoice"/>
		        <a data-role="button" data-icon="search" data-click="invoiceSearch"></a>        
    	</div>
        <div data-role="tabstrip">
            <a href="#invoice_list_day" data-icon="recents">Ngày</a>
            <a href="#invoice_list_week" data-icon="mostrecent">Tuần</a>
            <a href="#invoice_list_month" data-icon="organize">Tháng</a>
            <a href="#invoice_list_search" data-icon="search"></a>
        </div>    
    </div>   
</div>

<script>
	function onInvoiceSearchShow()
	{    		
		$(".search-container").show();    			
	}
	function invoiceSearch()
	{		
		initInvoiceSearchList();
	}
	
	function initInvoiceSearchList()
    	{
    		app.showLoading();
    		pageNumber = 0;
    		
    		var dataSource = new kendo.data.DataSource({
                serverPaging: true,
                pageSize: 20,
                transport: {
                    read: {
                        url: "service/invoice", 
                        dataType: "json" 
                    },
                    parameterMap: function(options) {
	                    options = {	                        
	                        size: options.pageSize,
	                        from: '20100101',
	                        to:'29990101'
	                    };
	                    if (paged) {
	                         paged = false;
	                    }
	                    else
	                    {
	                    	pageNumber = 0;
	                    }
	                    options["page"] = pageNumber;
	                    options["keyword"] = $("#invoice_list_search").find("#text_search_invoice").val();
	                    return options;
	                }
                },
                schema: { // describe the result format
                    parse: function(response) {
	                    pageNumber = pageNumber +1;
                   		app.hideLoading();
	                    return response;
	                },
                    // the data which the data source will be bound to is in the "results" field
                    data: function(data) {
                        return data || [];
                    },
                    total: function() { return 10000; }
                }
            });
			paged = false;
	        $("#list-invoice-search").kendoMobileListView({
	            dataSource: dataSource,
	            pullToRefresh: true,
	            appendOnRefresh: false,
	            endlessScroll: true,
	            endlessScrollParameters: function() {	            	
	                paged = true;
	            },
	            template: list_invoice_item_template
	        });
    	}
</script>
<script>
	function onInvoiceDayShow()
    	{    		
    		$(".search-container").hide();    			
    	}
    	<?php	    		
			$today = new DateTime();			
			echo 'var today = '.date_format($today, 'Ymd').';';			
		?>
		
    	function initInvoiceDayList()
    	{
    		app.showLoading();
    		pageNumber = 0;
    		
    		var dataSource = new kendo.data.DataSource({
                serverPaging: true,
                pageSize: 20,
                transport: {
                    read: {
                        url: "service/invoice", 
                        dataType: "json" 
                    },
                    parameterMap: function(options) {
	                    options = {	                        
	                        size: options.pageSize,
	                        from: today,
	                        to:today
	                    };
	                    if (paged) {	                        
	                         paged = false;
	                    }
	                    else
	                    {
	                    	pageNumber = 0;
	                    }
	                    options["page"] = pageNumber;
	                    return options;
	                }
                },
                schema: { // describe the result format
                    parse: function(response) {
	                    pageNumber = pageNumber +1;
                   		app.hideLoading();	
	                    return response;
	                },
                    // the data which the data source will be bound to is in the "results" field
                    data: function(data) {
                        return data || [];
                    },
                    total: function() { return 10000; }
                }
            });
			paged = false;
	        $("#list-invoice-day").kendoMobileListView({
	            dataSource: dataSource,
	            pullToRefresh: true,
	            appendOnRefresh: false,
	            endlessScroll: true,
	            endlessScrollParameters: function() {	            	
	                paged = true;
	            },
	            template: list_invoice_item_template
	        });
    	}
</script>

<script>
	function onInvoiceMonthShow()
	{    		
		$(".search-container").hide();    			
	}
	<?php			
		$firstDayOfTheMonth = strtotime('first day of this month');
		//$firstDayOfTheMonth = strtotime('first day of March 2010');
		$dtStrFirstDayOfMonth = date("c", $firstDayOfTheMonth);
		$dateFirstDayOfMonth = new DateTime($dtStrFirstDayOfMonth);
		$today = new DateTime();
		echo 'var beginMonth = '.date_format($dateFirstDayOfMonth, 'Ymd').';';
		echo 'var today = '.date_format($today, 'Ymd').';';			
	?>
	
	function initInvoiceMonthList()
	{
		app.showLoading();
		pageNumber = 0;
		
		var dataSource = new kendo.data.DataSource({
            serverPaging: true,
            pageSize: 20,
            transport: {
                read: {
                    url: "service/invoice", 
                    dataType: "json" 
                },
                parameterMap: function(options) {
                    options = {	                        
                        size: options.pageSize,
                        from: beginMonth,
                        to:today
                    };
                    if (paged) {	                        
                         paged = false;
                    }
                    else
                    {
                    	pageNumber = 0;
                    }
                    options["page"] = pageNumber;	                    
                    return options;
                }
            },
            schema: { // describe the result format
                parse: function(response) {
                    pageNumber = pageNumber +1;
               		app.hideLoading();
                    return response;
                },
                // the data which the data source will be bound to is in the "results" field
                data: function(data) {
                    return data || [];
                },
                total: function() { return 10000; }
            }
        });
		paged = false;
        $("#list-invoice-month").kendoMobileListView({
            dataSource: dataSource,
            pullToRefresh: true,
            appendOnRefresh: false,
            endlessScroll: true,
            endlessScrollParameters: function() {	            	
                paged = true;
            },
            template: list_invoice_item_template
        });
	}
</script>

<script>
    	function onInvoiceWeekShow()
    	{    		
    		$(".search-container").hide();    			
    	}
    	<?php	
    		$timeFirstDayOfWeek = strtotime('monday this week');
			$dtStrFirstDayOfWeek = date("c", $timeFirstDayOfWeek);
			$dateFirstDayOfWeek = new DateTime($dtStrFirstDayOfWeek);
			$today = new DateTime();
			echo 'var beginWeek = '.date_format($dateFirstDayOfWeek, 'Ymd').';';
			echo 'var today = '.date_format($today, 'Ymd').';';			
		?>
		
    	function initInvoiceWeekList()
    	{
    		app.showLoading();
    		pageNumber = 0;
    		
    		var dataSource = new kendo.data.DataSource({
                serverPaging: true,
                pageSize: 20,
                transport: {
                    read: {
                        url: "service/invoice", 
                        dataType: "json" 
                    },
                    parameterMap: function(options) {
	                    options = {	                        
	                        size: options.pageSize,
	                        from: beginWeek,
	                        to:today
	                    };
	                    if (paged) {	                        
	                         paged = false;
	                    }
	                    else
	                    {
	                    	pageNumber = 0;
	                    }
	                    options["page"] = pageNumber;
	                    return options;
	                }
                },
                schema: { // describe the result format
                    parse: function(response) {
	                    pageNumber = pageNumber +1;
                   		app.hideLoading();
	                    return response;
	                },
                    // the data which the data source will be bound to is in the "results" field
                    data: function(data) {
                        return data || [];
                    },
                    total: function() { return 10000; }
                }
            });
			paged = false;
	        $("#list-invoice-week").kendoMobileListView({
	            dataSource: dataSource,
	            pullToRefresh: true,
	            appendOnRefresh: false,
	            endlessScroll: true,
	            endlessScrollParameters: function() {	            	
	                paged = true;
	            },
	            template: list_invoice_item_template
	        });
    	}
    </script>
